<%--
  Created by IntelliJ IDEA.
  User: zouy
  Date: 2016/12/23
  Time: 11:18
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<head>
    <base href="<%=basePath%>">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>index jsp</title>
    <!-- 引入 Bootstrap -->
    <link href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <link href="/jsp/common/css/bootstrap-datetimepicker.min.css" rel="stylesheet">
    <style type="text/css">
        body{
            padding:0px;
        }
        th,td,ul{
            text-align:center;
        }
        #center-right-listGroup a{
            text-align:center;
        }
        .divbkgimg{
            background:url('/jsp/common/imgs/bkg.jpg');
        }
    </style>
    <!-- 引入 js -->
    <script src="http://cdn.static.runoob.com/libs/jquery/2.0.2/jquery.min.js"></script>
    <script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="/jsp/common/js/bootstrap-datetimepicker.min.js"></script>
    <script src="/jsp/common/js/bootstrap-datetimepicker.fr.js"></script>
    <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
    <script src="/jsp/common/js/md5.js"></script>
</head>
<body style="background-color: #f7f7f7;" ng-app="mainapp">

    <div ng-controller="maincontroller"><%--start--%>
        <!-- 引入 自己的js -->
        <script src="/jsp/enlist/js/index.js"></script>
        <!--top nav-->
        <nav class="navbar navbar-default" role="navigation">
            <div class="container-fluid">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse"
                            data-target="#example-navbar-collapse">
                        <span class="sr-only">切换导航</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="#">报名系统</a>
                </div>
                <div class="collapse navbar-collapse" id="example-navbar-collapse">
                    <ul class="nav navbar-nav">
                        <li class="active"><a href="#">iOS</a></li>
                        <li><a href="#">Web</a></li>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                Java <b class="caret"></b>
                            </a>
                            <ul class="dropdown-menu">
                                <li><a href="#">jmeter</a></li>
                                <li><a href="#">EJB</a></li>
                                <li><a href="#">Jasper Report</a></li>
                                <li class="divider"></li>
                                <li><a href="#">ssh</a></li>
                                <li class="divider"></li>
                                <li><a href="#">更多...</a></li>
                            </ul>
                        </li>
                    </ul>

                    <ul class="nav navbar-nav navbar-right">
                        <li><a href="#"><span class="glyphicon glyphicon-user"></span> 注册</a></li>
                        <li><a href="#"><span class="glyphicon glyphicon-log-in"></span> 登录</a></li>
                    </ul>
                </div>
            </div>
        </nav>

        <!--center content-->
        <div><%--2 8 2网格布局--%>

            <div class="container">
                <div class="row" >
                    <div class="col-md-2">
                        <div style="background:url('/jsp/common/imgs/left-show.jpg');height: 600px;padding-top: 10px;">

                            <div style="text-align: center;">
                                <button class="btn btn-warning btn-lg">培</button>
                            </div>
                            <div style="text-align: center;margin-top: 10px;">
                                <button class="btn btn-warning btn-lg">训</button>
                            </div>
                            <div style="text-align: center;margin-top: 10px;">
                                <button class="btn btn-warning btn-lg">机</button>
                            </div>
                            <div style="text-align: center;margin-top: 10px;">
                                <button class="btn btn-warning btn-lg">构</button>
                            </div>
                            <div style="text-align: center;margin-top: 10px;">
                                <button class="btn btn-warning btn-lg">报</button>
                            </div>
                            <div style="text-align: center;margin-top: 10px;">
                                <button class="btn btn-warning btn-lg">名</button>
                            </div>
                            <div style="text-align: center;margin-top: 10px;">
                                <button class="btn btn-warning btn-lg">系</button>
                            </div>
                            <div style="text-align: center;margin-top: 10px;">
                                <button class="btn btn-warning btn-lg">统</button>
                            </div>

                        </div>
                    </div>

                    <%--<div class="clearfix visible-xs"></div>--%>

                    <div class="col-md-8"
                         style="/*background-color: #dedef8;
            box-shadow: inset 1px -1px 1px #444, inset -1px 1px 1px #444;*/">

                        <div ng-show="showStatus >= 2 && showStatus <= 6">
                            <h3 style="color: crimson;" ng-bind="enlistConstant[0]"></h3>
                        </div>

                        <div>
                            <div class="ng-hide" ng-show="showStatus == 0">
                                <%@ include file="jspf/home.jspf" %>
                            </div>
                            <div class="ng-hide" ng-show="showStatus == 1">
                                <%@ include file="jspf/login.jspf" %>
                            </div>
                            <div class="ng-hide" ng-show="showStatus == 2">
                                <%@ include file="jspf/readBefore.jspf" %>
                            </div>
                            <div class="ng-hide" ng-show="showStatus == 3">
                                <%@ include file="jspf/type.jspf" %>
                            </div>
                            <div class="ng-hide" ng-show="showStatus == 4">
                                <%@ include file="jspf/infoDetail.jspf" %>
                            </div>
                            <div class="ng-hide" ng-show="showStatus == 5">
                                <%@ include file="jspf/password.jspf" %>
                            </div>
                            <div class="ng-hide" ng-show="showStatus == 6">
                                <%@ include file="jspf/pay.jspf" %>
                            </div>
                            <div class="ng-hide" ng-show="showStatus == 7">
                                <%@ include file="jspf/successNum.jspf" %>
                            </div>
                            <div class="ng-hide" ng-show="showStatus == 8">
                                <%@ include file="jspf/exam.jspf" %>
                            </div>
                            <div class="ng-hide" ng-show="showStatus == 9">
                                <%@ include file="jspf/result.jspf" %>
                            </div>
                        </div>
                    </div>

                    <div class="col-md-2" ng-show="showStatus >= 2 && showStatus <= 6"
                         style="/*background-color: #dedef8;*/" id="center-right-listGroup">
                        <a ng-class="{active:showStatus == 2}" class="list-group-item">报名须知</a>
                        <a ng-class="{active:showStatus == 3}" class="list-group-item">报考类别</a>
                        <a ng-class="{active:showStatus == 4}" class="list-group-item">个人详细信息</a>
                        <a ng-class="{active:showStatus == 5}" class="list-group-item">设置登录密码</a>
                        <a ng-class="{active:showStatus == 6}" class="list-group-item">考试费用支付</a>
                    </div>
                </div>
            </div>

        </div>

        <!--modal-->
        <div>
            <%@ include file="jspf/modal.jspf" %>
        </div>

    </div><%--end--%>

</body>
</html>
